<template>
  <div class="app-container">
    <el-form ref="formRef" :model="form" :rules="rules" label-width="240px">
      <!-- 私桩 -->
      <el-row>
        <el-col :span="12">
          <el-form-item label="支付APPkey" prop="defaultPayAppKey">
            <el-select v-model="form.defaultPayAppKey" placeholder="请选择支付APPkey" clearable filterable style="width: 100%">
              <el-option
                v-for="(item,index) in payApplicatList"
                :key="index"
                :label="item.label"
                :value="item.appKey"
              />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="支付APPkey" prop="defaultTransferAppKey">
            <el-select v-model="form.defaultTransferAppKey" placeholder="请选择支付APPkey" clearable filterable style="width: 100%">
              <el-option
                v-for="(item,index) in payApplicatList"
                :key="index"
                :label="item.label"
                :value="item.appKey"
              />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="佣金冻结时间" prop="brokerageFrozenDays">
            <el-input-number v-model="form.brokerageFrozenDays" step-strictly :step="1" :min="0"></el-input-number>
            <span style="margin-left:10px;">天</span>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="桩提现最低金额" prop="brokerageWithdrawMinPrice" >
            <el-input-number v-model="form.brokerageWithdrawMinPrice" :precision="2" :step="1" :min="0"></el-input-number>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="用户提现手续费百分比" prop="brokerageWithdrawFeePercent" >
            <el-input-number v-model="form.brokerageWithdrawFeePercent" :precision="2" :step="1" :min="0"></el-input-number>
            <span style="margin-left:10px;">%</span>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="用户提现类型" prop="brokerageWithdrawType">
            <el-select v-model="form.brokerageWithdrawType" multiple clearable filterable style="width: 100%;" placeholder="请选择用户提现类型">
              <el-option
                v-for="item in dict.type.config_user_withdraw_type"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="" label-width="100px">
            <el-button type="primary" :loading="popLodding" v-hasPermi="['trade:config:save']" @click="submitForm">保存</el-button>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
  </div>
</template>

<script>
import { tradeConfigDetail,tradeConfigSave, } from "@/api/config/tradCenterConfig";
import { payAppOptionSelect } from "@/api/finance/payApplicatInfor";
export default {
 name: 'TradCenterConfig',
 dicts: ['config_user_withdraw_type',],
 components: {  },
 data() {
   return {
     popLodding:false,//弹窗加载
    payApplicatList:[],//支付应用标识数据
    rules: {
      defaultPayAppKey: [{required: true, message: "默认支付APPkey不能为空", trigger: "blur"}],
      defaultTransferAppKey: [{required: true, message: "默认转账APPkey不能为空", trigger: "blur"}],
      brokerageFrozenDays: [{required: true, message: "佣金冻结时间(天)不能为空", trigger: "blur"}],
      brokerageWithdrawMinPrice: [{required: true, message: "桩提现最低金额不能为空", trigger: "blur"}],
      brokerageWithdrawFeePercent: [{required: true, message: "用户提现手续费百分比不能为空", trigger: "blur"}],
      brokerageWithdrawType: [{required: true, message: "用户提现类型不能为空", trigger: "change"}],
    },
    form: {},// 表单参数
   };
 },
 mounted(){
  this.payAppOptionSelect()
   this.getDetail()
 },
 methods: {
  async payAppOptionSelect(){//获取支付应用标识数据
    let res = await payAppOptionSelect()
    let data = res.data || []
    this.payApplicatList = data
  },
  async getDetail(){//查询交易中心配置列表
    let res = await tradeConfigDetail()
    let data = res.data || {}
    let brokerageWithdrawType = data.brokerageWithdrawType || ''
    this.form = {
      ...data,
      brokerageWithdrawMinPrice: this.math.divide( data.brokerageWithdrawMinPrice || 0,100),
      brokerageWithdrawType: brokerageWithdrawType ? brokerageWithdrawType.split(',') : [],
    }
  },
  submitForm() {
    this.$refs["formRef"].validate(valid => {
      if (valid) {
        let forms = {...this.form}
        forms.brokerageWithdrawMinPrice = this.math.multiply( forms.brokerageWithdrawMinPrice || 0,100)
        let brokerageWithdrawType = forms.brokerageWithdrawType || []
        forms.brokerageWithdrawType = brokerageWithdrawType.toString()
        this.popLodding = true
        tradeConfigSave(forms).then(response => {
          this.popLodding = false
          this.$modal.msgSuccess("保存成功")
          this.getDetail();
        }).catch(error=>this.popLodding = false);
      }
    });
  },
 }
}
</script>
